import {} from 'react'
import style from './index.module.less'
import { useAppDispatch, useAppSelector } from '@src/redux/hook'
import { List, Dialog } from 'antd-mobile'
import { UploadOutline, EditSOutline, FileOutline } from 'antd-mobile-icons'
import { push, setList } from '@src/redux/reducers/pages'
import { logout } from '@src/redux/reducers/basic'
import uuid from 'uuid'

const { Item } = List

function Main () {
  const userInfo = useAppSelector(state => state.basic.userInfo)
  const dispatch = useAppDispatch()
  return (
    <div className={style.container}>
      <div className={style.header}>
        <div className={style.name}>{userInfo && userInfo.realname}</div>
        <div className={style.mobile}>{userInfo && userInfo.mobile}</div>
      </div>
      <List>
        <Item prefix={<FileOutline className={style.icon} />} onClick={() => {
          dispatch(push({ element: 'caselibList', title: '案例库' }))
        }}>案例库</Item>
        <Item prefix={<FileOutline className={style.icon} />} onClick={() => {
          dispatch(push({ element: 'doclibList', title: '文书库' }))
        }}>文书库</Item>
        <Item prefix={<FileOutline className={style.icon} />} onClick={() => {
          dispatch(push({ element: 'knowledgelibList', title: '知识库' }))
        }}>知识库</Item>
        <Item prefix={<EditSOutline className={style.icon} />} onClick={() => {
          dispatch(push({ element: 'modifyPassword', title: '修改密码' }))
        }}>修改密码</Item>
        <Item prefix={<UploadOutline className={style.out} />} onClick={() => {
          Dialog.confirm({
            title: '您确认要退出吗？',
            onConfirm: () => {
              dispatch(logout())
              dispatch(setList([{ element: 'login', title: '登录', id: uuid() }]))
            }
          })
        }}>退出</Item>
      </List>
    </div>
  )
}

export default Main
